{% extends "base.html" %}

{% block head %}
  <script type="text/javascript" src="/media/js/live/index.js"></script>
{% endblock %}

{% block content %}
  <p>
    Welcome to the Live Interface !
  </p>

  <p>
    Use this interface to track vehicles on your mobile device.
  </p>

  <h4>List of vehicles (Last updated : <span id="updateTime">never :(</span>)</h4>

  <div id="vehicles">Vehicle list not loaded :(</div>

  <p>
    <a href="/admin/track/vehicle/add/">Add vehicle</a>
  </p>

  <h4>List of tags</h4>

  <table>
    <tr><th>Name</th><th>Creator</th><th>Is Public ?</th><th colspan="2">Actions</th></tr>
  {% for t in tag_list %}
    <tr>
      <td>{{ t.name }}</td>
      <td>{{ t.user }}</td>
      <td>
        {{ t.is_public|yesno:"Yes,No" }}
      </td>
      <td>
        <a href="tag/set/public/{{ t.slug }}/{{ t.is_public|yesno:"False,True" }}/">
          Make {{ t.is_public|yesno:"private,public" }}
        </a>
      </td>
      <td>
        <a href="tag/delete/{{ t.slug }}/">
          Delete
        </a>
      </td>
    </tr>
  {% endfor %}
  </table>

  <p>
    <label>
      Tag :
      <input type="text" id="newTag" value="">
    </label>
    <a onclick="newTag()">New</a>
  </p>


  <h4>List of vehicle tags</h4>

  <ul>
  {% for vt in vehicleTag_list %}
    <li>{{ vt }}</li>
  {% endfor %}
  </ul>

  <p>
    Tag :
    <select id="tag">
    {% for t in tag_list %}
      <option value="{{ t.slug }}">{{ t.name }}</option>
    {% endfor %}
    </select>
    Vehicle :
    <select id="vehicle">
    {% for v in vehicle_list %}
      <option value="{{ v.slug }}">{{ v.name }}</option>
    {% endfor %}
    </select>
    <a onclick="addTag()">Add</a>
  </p>

{% endblock %}
